<!doctype html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name="renderer" content="webkit">
    <meta name="format-detection" content="telephone=no"/>
    <title>最新资讯/详情</title>
    <link rel="stylesheet" href="css/scroll/demo.css"/>
    <link rel="stylesheet" href="css/scroll/jquery.jscrollpane.css"/>

    <link rel="stylesheet" href="css/base.css"/>
    <link rel="stylesheet" href="css/common.css"/>
    <link rel="stylesheet" href="css/pro-details.css"/>
    <link rel="stylesheet" href="css/new.css"/>
    <link rel="stylesheet" href="css/active.css"/>

    <!--弹窗-->
    <link rel="stylesheet" href="css/pop-up.css"/>

    <!--media-->
    <link rel="stylesheet" href="css/media/common.css"/>
    <link rel="stylesheet" href="css/media/news.css"/>
    <link rel="stylesheet" href="css/media/common-m.css"/>
</head>
<body>
<div class="container">
    <div class="container-common clearfix">
        <div class="container-common-top clearfix">
            <div class="container-common-top-fl fl"><a class="a-href"
                                                       href="index.html">
                    <img src="<?= $web_set_assoc['logo'] ?>"></a></div>
            <div class="container-common-top-fr fr"><img class="container-common-top-fr-img"
                                                         src="img/common/tel.png"/><span
                        class="com-x1"><?= $web_set_assoc['phone'] ?></span></div>
        </div>
        <div class="container-common-nav"><img class="navc navc1" src="img/common/navc.png"/> <img
                    class="navc hide navc2" src="img/common/nav-err.png"/></div>

        <div class="pro-container pagees">
            <!--新闻资讯-->
            <div class="news-container mar-auto clearfix clearfix2">
                <?php
                for ($i = 0; $i < $news_num; $i++) {
                    ?>
                    <div class="about-new-item fl" nid="<?= $news_assoc[$i]['id'] ?>">
                        <div class="about-new-item-d1"><?= date('Y-m-d', $news_assoc[$i]['time']) ?></div>
                        <div class="about-new-item-t1"><?= $news_assoc[$i]['title'] ?></div>
                        <div class="about-new-item-t2">
                            <?php
                            if ($news_assoc[$i]['show_image'] !== '') {
                                ?>
                                <img class="about-new-item-t2-img" src="<?= $news_assoc[$i]['show_image'] ?>"/>
                                <?php
                            }
                            ?>
                            <span class="t2-text"><?= $news_assoc[$i]['show_content'] ?></span>
                        </div>
                    </div>
                    <?php
                }
                ?>
            </div>

            <!--联系我们-->
            <div class="pro-tel pro-tel-02 clearfix">

                <div class="about-tel-container-phone hide">
                    <div class="about-tel-fr ">
                        <div class="about-tel-fr-t1"><?= $web_set_assoc['company'] ?></div>
                        <?php
                        preg_match('/(.*)<bn\/>(.*)<bn\/>(.*)/', $web_set_assoc['intro'], $intro);
                        ?>
                        <div class="about-tel-fr-t2"><?= $intro[1] ?>
                            <span class="com-j1"><?= $intro[2] ?></span>
                        </div>
                        <div class="about-tel-fr-t2"><?= $intro[3] ?></div>
                    </div>
                    <div class="about-tel-nav-b clearfix">
                        <div class="about-tel-nav-b-fl about-tel-nav-b-fl01 fl"></div>
                        <div class="about-tel-nav-b-fl- fl">联系我们</div>
                        <div class="about-tel-nav-b-fl about-tel-nav-b-fl02 fr"></div>
                    </div>
                    <div class="about-tel-fl-01-c">
                        <div class="about-tel-fl-01-cp clearfix">
                            <div class="about-tel-input fl"><input class="inp01" id="int01" placeholder="某某某"></div>
                            <div class="about-tel-error fr gr1"><img class="about-tel-error-img"
                                                                     src="img/index/p05-01.png"/><span
                                        class="com-j2"></span></div>
                        </div>
                        <div class="about-tel-fl-01-cp clearfix">
                            <div class="about-tel-input fl"><input class="inp01" id="int02" placeholder="Emial"></div>
                            <div class="about-tel-error fr gr1"><img class="about-tel-error-img"
                                                                     src="img/index/p05-01.png"/><span
                                        class="com-j2"></span></div>
                        </div>
                        <div class="about-tel-fl-01-cp about-tel-fl-01-cp3 clearfix">
                            <div class="about-tel-input fl"><textarea class="inp01 inp03" id="int03"
                                                                      placeholder="内容"></textarea></div>
                            <div class="about-tel-error fr gr1"><img class="about-tel-error-img"
                                                                     src="img/index/p05-01.png"/><span
                                        class="com-j2"></span></div>
                        </div>
                    </div>
                    <div class="about-tel-fl-01-t2" onclick="submit()">发送</div>
                    <div class="banquan"><?= $web_set_assoc['icp'] ?><br/><?= $web_set_assoc['copyright'] ?>
                    </div>

                </div>

                <div class="about-tel-fl  about-tel-fl-01 fl">
                    <div class="about-tel-fl-01-c">
                        <div class="about-tel-fl-01-cp clearfix">
                            <div class="about-tel-input fl"><input class="inp01" id="int01" placeholder="某某某"></div>
                            <div class="about-tel-error fr gr1"><img class="about-tel-error-img"
                                                                     src="img/index/p05-01.png"/><span
                                        class="com-j2"></span></div>
                        </div>
                        <div class="about-tel-fl-01-cp clearfix">
                            <div class="about-tel-input fl"><input class="inp01" id="int02" placeholder="Emial"></div>
                            <div class="about-tel-error fr gr1"><img class="about-tel-error-img"
                                                                     src="img/index/p05-01.png"/><span
                                        class="com-j2"></span></div>
                        </div>
                        <div class="about-tel-fl-01-cp about-tel-fl-01-cp3 clearfix">
                            <div class="about-tel-input fl"><textarea class="inp01 inp03" id="int03"
                                                                      placeholder="内容"></textarea></div>
                            <div class="about-tel-error fr gr1"><img class="about-tel-error-img"
                                                                     src="img/index/p05-01.png"/><span
                                        class="com-j2"></span></div>
                        </div>
                    </div>
                    <div class="about-tel-fl-01-t2" onclick="submit()">发送</div>
                </div>
                <div class="about-tel-fr about-tel-fr-01 fr">
                    <div class="about-tel-fr-t1"><?= $web_set_assoc['company'] ?></div>
                    <div class="about-tel-fr-t2"><?= $intro[1] ?>
                        <span class="com-j1"><?= $intro[2] ?></span>
                    </div>
                    <div class="about-tel-fr-t2">ADD : 浙江省宁波市海曙区丽园北路668号美丽园大厦602</div>
                    <div class="about-tel-fr-t3 clearfix">
                        <div class="about-tel-fr-t3-fl fl clearfix">
                            <div class="about-tel-fr-t3-fl-t1 fl"><a href="about.html">关于我们</a></div>
                            <div class="about-tel-fr-t3-fl-t1 fl"><a href="#">联系我们</a></div>
                            <div class="about-tel-fr-t3-fl-t1 fl"><a href="pro.html">产品中心</a></div>
                            <div class="about-tel-fr-t3-fl-t1 fl"><a href="#">登录</a>/<a href="#">注册</a></div>
                            <div class="about-tel-fr-t3-fl-t1 fl"><a href="news.html">最新资讯</a></div>
                        </div>
                        <div class="about-tel-fr-t3-fr fr"><img class="about-tel-fr-t3-fr-img"
                                                                src="<?= $web_set_assoc['code'] ?>"/>
                            <div class="about-tel-fr-t3-fr-01"><img src="img/index/p06-02.png"/>扫一扫 了解更多</div>
                        </div>
                    </div>
                    <div class="about-tel-fr-t4"><?= $web_set_assoc['icp'] ?> <?= $web_set_assoc['copyright'] ?></div>
                </div>
            </div>


            <!--返回顶部-->
            <div class="return-top hide"><img class="return-top-img" src="img/common/top.png"/></div>


        </div>

    </div>
    <div class="hide-nav hide op01 z-index01">
        <div class="hide-nav-fl-title"><img src="<?= $web_set_assoc['logo'] ?>"></div>
        <div class="hide-navs">
            <ul class="hide-navs-ul">
                <li class="navs-li "><a href="index.html">首页</a></li>
                <li class="navs-li"><a href="pro.html">产品中心</a></li>
                <li class="navs-li"><a href="about.html">关于我们</a></li>
                <li class="navs-li navs-li-active"><a href="news.html">最新资讯</a></li>
                <li class="navs-li lianxi"><a href="#">联系我们</a></li>
                <li class="navs-li"><a href="#">登录</a>/<a href="#">注册</a></li>
            </ul>
        </div>
    </div>

    <div class="pc-hide-nav ">
        <ul class="pc-hide-navs-ul">
            <li class="pc-navs-li "><a href="index.html"><img class="pc-navs-li-img" src="img/common/nav-index.png"/>首页</a>
            </li>
            <li class="pc-navs-li"><a href="pro.html">产品中心</a></li>
            <li class="pc-navs-li "><a href="about.html">关于我们</a></li>
            <li class="pc-navs-li pc-navs-li-active"><a href="news.html">最新资讯</a></li>
            <li class="pc-navs-li lianxi"><a href="#">联系我们</a></li>
            <li class="pc-navs-li"><a href="">登录</a>/<a href="#">注册</a></li>
        </ul>
    </div>


    <div class="zz hide"></div>


    <!--弹出框-->
    <div class="zz6 hide"></div>

    <div class="tc-pro">
        <div class="zz6-err"><img src="img/pro/pro-d1-err.png"/></div>
        <div class="tc-pro-container">
            <div class="news-title"></div>
            <div class="news-t2"></div>
            <div class="new-details-container"></div>
            <div class="container-close">【关闭】</div>
        </div>
    </div>


</div>

<script src="js/jquery.min.js"></script>
<script src="js/font-size.js"></script>
<script src="js/scroll/jquery.mousewheel.js"></script>
<script src="js/scroll/jquery.jscrollpane.js"></script>
<script src="js/common.js"></script>


<script>
    $(document).on("click", ".about-new-item", function () {
        $(".news-title").html("");
        $(".news-t2").html("");
        $(".new-details-container").html('<div class="spinner">\n' +
            '  <div class="rect1"></div>\n' +
            '  <div class="rect2"></div>\n' +
            '  <div class="rect3"></div>\n' +
            '  <div class="rect4"></div>\n' +
            '  <div class="rect5"></div>\n' +
            '</div>');
        $(".zz6").removeClass("hide");
        $(".tc-pro").addClass("tc-pro-add")
        var nid = $(this).attr("nid");
        $.ajax({
            url: "posts.php",
            type: "POST",
            async: true,
            timeOut: 50000,
            dataType: "json",
            data: {
                type: "add-news-html",
                id: nid
            },
            success: function (data, textStatus, jqXHR) {
                console.log(data);
                if (data.status === 0) {
                    $(".news-title").html(data.title);
                    $(".news-t2").html(data.date);
                    $(".new-details-container").html(data.content);
                    $(".zz6").removeClass("hide");
                    $(".tc-pro").addClass("tc-pro-add")
                } else {
                    console.log(data.error);
                }
            },
            error: function (xhr, textStatus) {
                console.log(xhr + textStatus);
            }
        })
    });
    $(".zz6-err").click(function () {
        $(".zz6").addClass("hide");
        $(".tc-pro").removeClass("tc-pro-add")
    });
    $(".container-close").click(function () {
        $(".zz6").addClass("hide");
        $(".tc-pro").removeClass("tc-pro-add")
    });


    $(function () {
        var content_arr = [];//定义一个空数组
        $('.t2-text').each(function () {//遍历box内容
            var content = $.trim($(this).text());//去掉前后文空格
            content_arr.push(content);//内容放进数组
        })
        for (var i = 0; i < content_arr.length; i++) {//遍历循环数组
            if (content_arr[i].length >= 90) {//如果数组长度（也就是文本长度）大于等于50（数字可自己定义）
                content = content_arr[i].substr(0, 90) + '...';//添加省略号并放进box文字内容后面
                $(".t2-text").eq(i).text(content);
            } else {
                content = content_arr[i];
                $(".t2-text").eq(i).text(content);
            }
        }
    })

    //
    // $(function()
    // {
    //     $('.pagees').jScrollPane();
    // });
    //


</script>
<style>
    .spinner {
        margin: 100px auto;
        width: 50px;
        height: 60px;
        text-align: center;
        font-size: 10px;
    }

    .spinner > div {
        background-color: #000;
        height: 100%;
        width: 6px;
        display: inline-block;

        -webkit-animation: stretchdelay 1.2s infinite ease-in-out;
        animation: stretchdelay 1.2s infinite ease-in-out;
    }

    .spinner .rect2 {
        -webkit-animation-delay: -1.1s;
        animation-delay: -1.1s;
    }

    .spinner .rect3 {
        -webkit-animation-delay: -1.0s;
        animation-delay: -1.0s;
    }

    .spinner .rect4 {
        -webkit-animation-delay: -0.9s;
        animation-delay: -0.9s;
    }

    .spinner .rect5 {
        -webkit-animation-delay: -0.8s;
        animation-delay: -0.8s;
    }

    @-webkit-keyframes stretchdelay {
        0%, 40%, 100% { -webkit-transform: scaleY(0.4) }
        20% { -webkit-transform: scaleY(1.0) }
    }

    @keyframes stretchdelay {
        0%, 40%, 100% {
            transform: scaleY(0.4);
            -webkit-transform: scaleY(0.4);
        }  20% {
               transform: scaleY(1.0);
               -webkit-transform: scaleY(1.0);
           }
    }
</style>
</body>
</html>